<template>
  <p>foo:{{ foo }}</p>
  <p>propE:{{ propE }}</p>
  <p>propF:{{ propF }}</p>
  <button @click="submitForm">submitForm</button>
</template>
<script setup>
const emit = defineEmits(["submit"]);
function submitForm() {
  emit("submit", 9999);
}
const props = defineProps({
  foo: {
    type: [String, Number],
    required: true,
  },
  propE: {
    type: null,
    default: 100,
  },
  // 对象类型的默认值
  propF: {
    type: Object,
    // 对象或数组的默认值
    // 必须从一个工厂函数返回。
    // 该函数接收组件所接收到的原始 prop 作为参数。
    default(rawProps) {
      console.log("rawProps:", rawProps);
      return { message: "hello" };
    },
  },
  // 如果type仅为null而非使用数组语法，它将允许任何类型
});
// const emit = defineEmits({
//   // 校验 submit 事件
//   submit: ({ email, password }) => {
//     if (email && password) {
//       return true;
//     } else {
//       console.warn("Invalid submit event payload!");
//       return false;
//     }
//   },
// });
</script>
